﻿
$(function () {
    var jcrop_api;
    var defWidth = 300;
    var defHeight = 300;
    var curWidth = 0;
    var curHeight = 0;
    var rate = defWidth / defHeight;
    var zoom = 1;
    var size = { x: 0, y: 0, x1: 300, y1: 300 };
    function showPreview(coords) {
        showPreview_30(coords);
        showPreview_50(coords);
        showPreview_180(coords);
    }
    function showPreview_180(coords) {
        var rx = 180 / coords.w;
        var ry = 180 / coords.h;

        $('#preview_180').css({
            width: Math.round(rx * curWidth) + 'px',
            height: Math.round(ry * curHeight) + 'px',
            marginLeft: '-' + Math.round(rx * coords.x) + 'px',
            marginTop: '-' + Math.round(ry * coords.y) + 'px'
        });

        size.x = coords.x;
        size.y = coords.y;
        size.x1 = coords.x2;
        size.y1 = coords.y2;

    };
    function showPreview_50(coords) {
        var rx = 50 / coords.w;
        var ry = 50 / coords.h;

        $('#preview_50').css({
            width: Math.round(rx * curWidth) + 'px',
            height: Math.round(ry * curHeight) + 'px',
            marginLeft: '-' + Math.round(rx * coords.x) + 'px',
            marginTop: '-' + Math.round(ry * coords.y) + 'px'
        });

    };
    function showPreview_30(coords) {
        var rx = 30 / coords.w;
        var ry = 30 / coords.h;

        $('#preview_30').css({
            width: Math.round(rx * curWidth) + 'px',
            height: Math.round(ry * curHeight) + 'px',
            marginLeft: '-' + Math.round(rx * coords.x) + 'px',
            marginTop: '-' + Math.round(ry * coords.y) + 'px'
        });
    };
    $("#CutBox").load(function () {
        this.style.cssText = "";
        $("#loadCut").hide();
        $("#load_180").hide();
        $("#load_50").hide();
        $("#load_30").hide();
        var height = this.height;
        var width = this.width;
        if (height > defHeight || width > defWidth) {
            if ((width / height) > rate) {
                var r = width / defWidth;
                zoom = r;
                curHeight = Math.round(height / r);
                curWidth = Math.round(width / r);
            }
            else {
                var r = height / defHeight;
                zoom = r;
                curHeight = Math.round(height / r);
                curWidth = Math.round(width / r);
            }
        }
        else {
            curHeight = height;
            curWidth = width;
            zoom = 1;
        }
        $(this).width(curWidth);
        $(this).height(curHeight);
        if (jcrop_api)
            jcrop_api.destroy();
        jcrop_api = $.Jcrop("#CutBox", {
            onChange: showPreview,
            onSelect: showPreview,
            aspectRatio: 1
        });
    });
    $(".upload .btn_green").mousemove(function (e) {
        var btnX = e.pageX - $(this).offset().left;
        var btnY = e.pageY - $(this).offset().top;
        var uploadInput = $(this).find("input");
        uploadInput.css("left", btnX - 60);
        uploadInput.css("top", btnY - 10);
    });
    $("#frmPicUpload").find("input").change(function () {
        App.PicUpload("frmPicUpload", this, function () {
            $("#loadCut").show();
            $("#load_180").show();
            $("#load_50").show();
            $("#load_30").show();
        });
    });
    $("#submitAvatar").click(function () {
        if (this.locked)
            return false;
        this.locked = true;
        alink = this;
        $.ajax(
       {
           url: "/Ajax/cutAvatar",
           datatype: "json",
           cache: false,
           data: { imgSrc: $("#CutBox").attr("src"), x: size.x, y: size.y, x1: size.x1, y1: size.y1, zoom: zoom },
           type: "post",
           success: function (o) {
               if (o.Code == "A00001") {
                   App.showLoginDial();
               }
               else if (o.Code == "A00003") {
                   App.alert(CodeList["A00003"]);
               }
               else {
                   App.fullTip(CodeList[o.Code], 2000, null, 3);
               }
               alink.locked = false;
           },
           error: function (request) {
               App.alert(CodeList["A00003"]);
               alink.locked = false;
           }
       });
        return false;
    });

});
function uploadCallback(path) {
    $("#CutBox").attr("src", path);
    $("#preview_180").attr("src", path);
    $("#preview_50").attr("src", path);
    $("#preview_30").attr("src", path);

}
 